<template>
  <div class="cicon_box">
    <img class="cicon_svg" :src="svgUrlComp" />
  </div>
</template>

<script>
import { defineComponent, computed } from "vue";
export default defineComponent({
  name: "CIcon",
});
</script>
<script setup>
const props = defineProps(["name", "width", "height"]);

const svgUrlComp = computed(() => {
  return `http://wangweilun.top:1112/image/Web/bukaAdmin/icon/${props.name}.svg`;
});

const iconWidthComp = computed(() => {
  return props.width + "px";
});

const iconHeightComp = computed(() => {
  return props.height + "px";
});
</script>

<style lang="scss" scoped>
$iconWidth: v-bind(iconWidthComp);
$iconHeight: v-bind(iconHeightComp);

.cicon_svg {
  width: $iconWidth;
  height: $iconHeight;
}
</style>
